<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>创建对象</title>
	<!--<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>-->
</head>
<body>
<script>
	//1:JavaScript的原型链
	/**
	 * javaScript每创建对各对象都会有一个原型属性，每个对象的原型都会指向他的原型对象。
	 * JavaScript在查找一个属性的时候会优先在当前对象上查找，如果煤找到就会原型对象上
	 * 找，一直追溯到Object的原型如果还没有找到,就会返回undefined;
	 */

	/**
	 *该Array的原型链为 arr => Array.prototype => Object.prototype => null
	 *
	 * Array.prototype上定义了indexOf(),shift(),unshift()等方法，所以因此我们
	 * 可以在arr上调用这些方法。
	 */
	let arr = [1,2,3];


	/**
	 * 函数foo的原型链为 foo => Function.prototype => Object.prototype => null
	 * Function.prototype 上定义了apply方法，因此foo也可以使用该方法
	 */
	function foo() {
		return 0;
	}

	//2:JavaScript的构造函数
	/**
	 * 除了可以用{...}的方式创建对象之外，还可以用构造函数的方法
	 * 来创建一个对象
	 */
	/**
	 * 当用new关键子调用Student时候,返回一个对象。
	 * 其中this指向新创建的对象，并且默认返回this对象
	 *
	 * 当直接调用Student('xxx')那么就是一个普通你的函数
	 * 返回undefined;
	 */
	function Student(name) {
		this.name = name;
		this.sayHello = function () {
			console.log(this.name + " say hello!");
		}
	}
	let xiaohuang = new Student("小黄");
	let xiaolv = new Student("小绿");
	xiaohuang.sayHello();
	xiaolv.sayHello();

	console.log(xiaohuang.constructor === Student.prototype.constructor);
	console.log(Student.prototype.constructor === Student);
	console.log(Object.getPrototypeOf(xiaohuang) === Student.prototype);
	console.log(xiaohuang instanceof Student);
	//console.log(xiaohuang.prototype.constructor === Student.prototype);

	//利用构造函数来创建对象
	function Teacher(props) {
		this.name = props.name || '匿名';
		this.age = props.age || 0;
	}

	Teacher.prototype.teaching = function () {
		console.log(this.name + " is teaching!");
	};

	function createTeacher(prop) {
		return new Teacher(prop || {});
	}

	/**
	 *如果创建的对象有很多属性，我们只需要传递需要的某些属性，剩下的属性可以用默认值。
	 * 由于参数是一个Object，我们无需记忆参数的顺序。如果恰好从JSON拿到了一个对象，就可以直接创建出teacher
	 */
	let t1 = createTeacher();
	t1.teaching();

	/**
	 * 练习
	 * 请利用构造函数定义Cat，并让所有的Cat对象有一个name属性，并共享一个方法say()，返回字符串'Hello, xxx!'：
	 */
	function Cat(props) {
		this.name = props.name || "喵咪";
		this.color = props.color || "红色";
	}
	
	Cat.prototype.say = function () {
		console.log("Hello," + this.name + "!");
	};

	function createCat(props) {
		return new Cat(props || {});
	}

	let bob = {
		name:"小花",
		color:"黑色"
	};

	let cat = createCat(bob);
	cat.say();
</script>
</body>
</html>